<template>
  <div class="app-container">
    <PageSearch
      :showSearch.sync="showSearch"
      :getList="getList"
      :handleQuery="handleQuery"
      :resetQuery="resetQuery">
      <template #pagination>
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList" />
      </template>
      <template #form>
        <el-form :model="queryParams" ref="queryForm" size="small">
          <el-row>
            <!-- 厂家名称 -->
            <el-form-item prop="manufacturersName">
              <el-input
                v-model="queryParams.manufacturersName"
                :placeholder="$t('厂家名称')"
                clearable
                @keyup.enter.native="handleQuery" />
            </el-form-item>
            <!-- 厂家电话 -->
            <el-form-item prop="manufacturersTel">
              <el-input
                v-model="queryParams.manufacturersTel"
                :placeholder="$t('厂家电话')"
                clearable
                @keyup.enter.native="handleQuery" />
            </el-form-item>
            <!-- 负责人名称 -->
            <el-form-item prop="principalName">
              <el-input
                v-model="queryParams.principalName"
                :placeholder="$t('负责人名称')"
                clearable
                @keyup.enter.native="handleQuery" />
            </el-form-item>
            <!-- 负责人电话 -->
            <el-form-item prop="principalTel">
              <el-input
                v-model="queryParams.principalTel"
                :placeholder="$t('负责人电话')"
                clearable
                @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item prop="skuNo">
              <el-input
                v-model="queryParams.skuNo"
                :placeholder="$t('sku')"
                clearable
                @keyup.enter.native="handleQuery" />
            </el-form-item>
          </el-row>
        </el-form>
      </template>
      <template #actions>
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['distribution:manufacturers:add']">
          <!-- 新增 -->
          {{ $t('添加') }}
        </el-button>
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['distribution:manufacturers:edit']">
          <!-- 修改 -->
          {{ $t('编辑') }}
        </el-button>
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['distribution:manufacturers:remove']">
          <!-- 删除 -->
          {{ $t('删除') }}
        </el-button>
        <el-button
          v-hasPermi="['distribution:manufacturers:importManufacturers']"
          @click="showImport = true"
          type="primary"
          icon="el-icon-upload2"
          plain
          size="mini">
          <!-- 厂家导入 -->
          {{ $t('导入') }}
        </el-button>
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['distribution:manufacturers:export']">
          <!-- 厂家导出 -->
          {{ $t('导出') }}
        </el-button>
        <!-- 厂家关联sju -->
        <el-button
          @click="showManufacturersSkuImport = true"
          type="primary"
          icon="el-icon-upload2"
          plain
          size="mini"
          v-hasPermi="['distribution:manufacturersSku:importManufacturersSku']">
          <!-- 导入供应商厂家SKU关联 -->
          {{ $t('导入供应商厂家SKU关联') }}
        </el-button>
        <el-button
          v-hasPermi="['distribution:manufacturersSku:exportManufacturersSku']"
          @click="handleExportManufacturersSku"
          type="warning"
          plain
          icon="el-icon-download"
          size="mini">
          <!-- 导出供应商厂家SKU关联 -->
          {{ $t('导出供应商厂家SKU关联') }}
        </el-button>
      </template>
    </PageSearch>

    <el-table
      :height="calTableHeight()"
      v-loading="loading"
      ref="mianRef"
      :data="manufacturersList"
      @selection-change="handleSelectionChange">
      <el-table-column show-overflow-tooltip type="selection" width="55" align="center" />
      <!-- 厂家名称 -->
      <el-table-column
        show-overflow-tooltip
        width="150"
        :label="$t('厂家名称')"
        align="center"
        prop="manufacturersName" />
      <!-- 厂家电话 -->
      <el-table-column show-overflow-tooltip :label="$t('厂家电话')" align="center" prop="manufacturersTel" />
      <!-- 负责人名称 -->
      <el-table-column show-overflow-tooltip :label="$t('负责人名称')" align="center" prop="principalName" />
      <!-- 负责人电话 -->
      <el-table-column show-overflow-tooltip :label="$t('负责人电话')" align="center" prop="principalTel" />
      <!-- 厂家地址 -->
      <el-table-column
        show-overflow-tooltip
        :label="$t('厂家地址')"
        align="center"
        prop="manufacturersAddress" />
      <!-- 厂家链接 -->
      <el-table-column
        show-overflow-tooltip
        width="300"
        :label="$t('厂家链接')"
        align="center"
        prop="purchasePlatformLink" />
      <!-- 中国发货仓库 -->
      <el-table-column
        show-overflow-tooltip
        :label="$t('中国发货仓库')"
        align="center"
        prop="deliverPositionCn" />
      <!-- 中国发货方式 -->
      <el-table-column show-overflow-tooltip :label="$t('中国发货方式')" align="center" prop="deliverWayCn" />
      <!-- 是否默认供应厂家 -->
      <el-table-column
        show-overflow-tooltip
        :label="$t('是否默认供应厂家')"
        align="center"
        prop="isDefault" />
      <!-- 产品捆绑要求 -->
      <el-table-column
        show-overflow-tooltip
        :label="$t('产品捆绑要求')"
        align="center"
        prop="skuPackDemand" />
      <!-- 备注 -->
      <el-table-column show-overflow-tooltip :label="$t('备注')" align="center" prop="remark" />
      <!-- 操作 -->
      <el-table-column :width="calWidth(250, 350, 270)" :label="$t('操作')" align="center" fixed="right">
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="handleAssociatedSku(scope.row)">
            <!-- 查看关联sku -->
            {{ $t('查看关联sku') }}
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['distribution:manufacturers:edit']">
            <!-- 修改 -->
            {{ $t('编辑') }}
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['distribution:manufacturers:remove']">
            <!-- 删除 -->
            {{ $t('删除') }}
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <!-- 添加或修改供应厂家对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="140px">
        <!-- 厂家名称 -->
        <el-form-item :label="$t('厂家名称')" prop="manufacturersName">
          <el-input v-model="form.manufacturersName" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 厂家电话 -->
        <el-form-item :label="$t('厂家电话')" prop="manufacturersTel">
          <el-input v-model="form.manufacturersTel" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 负责人名称 -->
        <el-form-item :label="$t('负责人名称')" prop="principalName">
          <el-input v-model="form.principalName" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 负责人电话 -->
        <el-form-item :label="$t('负责人电话')" prop="principalTel">
          <el-input v-model="form.principalTel" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 厂家地址 -->
        <el-form-item :label="$t('厂家地址')" prop="manufacturersAddress">
          <el-input v-model="form.manufacturersAddress" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 厂家链接 -->
        <el-form-item :label="$t('厂家链接')" prop="purchasePlatformLink">
          <el-input v-model="form.purchasePlatformLink" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 中国发货仓库 -->
        <el-form-item :label="$t('中国发货仓库')" prop="deliverPositionCn">
          <el-input v-model="form.deliverPositionCn" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 中国发货方式 -->
        <el-form-item :label="$t('中国发货方式')" prop="deliverWayCn">
          <el-input v-model="form.deliverWayCn" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 是否默认供应厂家 -->
        <el-form-item :label="$t('是否默认供应厂家')" prop="isDefault">
          <el-input v-model="form.isDefault" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 产品捆绑要求 -->
        <el-form-item :label="$t('产品捆绑要求')" prop="skuPackDemand">
          <el-input v-model="form.skuPackDemand" :placeholder="$t('请输入')" />
        </el-form-item>
        <!-- 备注 -->
        <el-form-item :label="$t('备注')" prop="remark">
          <el-input v-model="form.remark" type="textarea" :placeholder="$t('请输入')" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button :loading="buttonLoading" type="primary" @click="submitForm">
          <!-- 确 定 -->
          {{ $t('确定') }}
        </el-button>
        <el-button @click="cancel">
          <!-- 取 消 -->
          {{ $t('取消') }}
        </el-button>
      </div>
    </el-dialog>
    <!-- 关联sku -->
    <el-dialog
      :title="associatedSkuInfo.title"
      :visible.sync="associatedSkuInfo.show"
      width="1000px"
      append-to-body>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            v-hasPermi="['distribution:skuDistributor:addManufacturersSku']"
            @click="handleAddAssociatedSku">
            <!-- 添加sku -->
            {{ $t('添加sku') }}
          </el-button>
        </el-col>
      </el-row>
      <el-table ref="mianRef" :data="associatedSkuInfo.tableData" style="width: 100%">
        <!-- <el-table-column type="selection" width="55" align="center" @selection-change="rows=>associatedSkuInfo.tableCheck=rows" /> -->
        <el-table-column prop="skuNo" label="sku" width="180" align="center" />
        <!-- 产品链接 -->
        <el-table-column prop="skuUrl" :label="$t('产品链接')" align="center">
          <template slot-scope="{ row }">
            <el-link :href="row.skuUrl" target="_blank" type="success">
              {{ row.skuUrl }}
            </el-link>
          </template>
        </el-table-column>
        <!-- 操作 -->
        <el-table-column
          show-overflow-tooltip
          :width="calWidth(350, 450, 500)"
          :label="$t('操作')"
          align="center"
          fixed="right">
          <!-- <template slot="header" slot-scope="scope">
            <div style="margin-right: 40px">操作</div>
          </template> -->
          <template slot-scope="{ row }">
            <el-button size="mini" type="text" @click="">
              <!-- 查看历史报价 -->
              {{ $t('查看历史报价') }}
            </el-button>
            <el-button size="mini" type="text" @click="handlePurchaseHis(row)">
              <!-- 查看历史采购价 -->
              {{ $t('查看历史采购价') }}
            </el-button>
            <el-button
              v-hasPermi="['distribution:manufacturersSku:remove']"
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelPurchaseHis(row)">
              <!-- 删除 -->
              {{ $t('删除') }}
            </el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              v-hasPermi="['distribution:manufacturersSku:edit']"
              @click="handleEditAssociatedSku(row)">
              <!-- 编辑 -->
              {{ $t('编辑') }}
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="associatedSkuInfo.total > 0"
        :total="associatedSkuInfo.total"
        :page.sync="associatedSkuInfo.queryParams.pageNum"
        :limit.sync="associatedSkuInfo.queryParams.pageSize"
        @pagination="getAssociatedSkuList" />
      <div slot="footer" class="dialog-footer">
        <el-button @click="associatedSkuInfo.show = false">
          <!-- 关闭 -->
          {{ $t('关闭') }}
        </el-button>
      </div>
    </el-dialog>
    <!-- 关联sku 新增-->
    <el-dialog
      :title="associatedSkuInfo.addInfo.title"
      :visible.sync="associatedSkuInfo.addInfo.show"
      width="500px"
      append-to-body>
      <el-form
        :model="associatedSkuInfo.addInfo.form"
        :rules="associatedSkuInfo.addInfo.rules"
        ref="addAssociatedSkuRef"
        size="small"
        label-width="70px">
        <el-form-item label="sku" prop="skuId">
          <el-select
            filterable
            :disabled="associatedSkuInfo.addInfo.type == 'edit'"
            style="width: 100%"
            v-model="associatedSkuInfo.addInfo.form.skuId">
            <el-option
              :key="item.skuId"
              v-for="item in associatedSkuInfo.addInfo.skuList"
              :label="item.skuNo"
              :value="item.skuId" />
          </el-select>
        </el-form-item>
        <!-- 产品链接 -->
        <el-form-item :label="$t('产品链接')">
          <el-input style="width: 100%" v-model="associatedSkuInfo.addInfo.form.skuUrl" />
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="associatedSkuInfo.addInfo.show = false">
          <!-- 关闭 -->
          {{ $t('关闭') }}
        </el-button>
        <el-button
          type="primary"
          @click="
            associatedSkuInfo.addInfo.type == 'add' ? confirmAddAssociatedSku() : confirmEditAssociatedSku()
          ">
          <!-- 确 认 -->
          {{ $t('确定') }}
        </el-button>
      </div>
    </el-dialog>
    <!-- 历史采购价 -->
    <el-dialog :title="$t('历史采购价')" :visible.sync="purchaseHisInfo.show" width="800px" append-to-body>
      <el-table ref="mianRef" :data="purchaseHisInfo.tableData" style="width: 100%">
        <!--  暂定 SKU编号、采购价（skuUnitPrice）、采购数量（num）采购日期（createTime） -->
        <!-- SKU编号 -->
        <el-table-column
          show-overflow-tooltip
          prop="skuNo"
          :label="$t('sku编号')"
          align="center"
          width="150" />
        <!-- 采购价 -->
        <el-table-column
          show-overflow-tooltip
          prop="skuUnitPrice"
          :label="$t('采购价')"
          align="center"
          width="150" />
        <!-- 采购数量 -->
        <el-table-column
          show-overflow-tooltip
          prop="num"
          :label="$t('采购数量')"
          align="center"
          width="150" />
        <!-- 采购日期 -->
        <el-table-column show-overflow-tooltip :label="$t('采购日期')" prop="createTime" align="center" />
      </el-table>
      <pagination
        v-show="purchaseHisInfo.total > 0"
        :total="purchaseHisInfo.total"
        :page.sync="purchaseHisInfo.queryParams.pageNum"
        :limit.sync="purchaseHisInfo.queryParams.pageSize"
        @pagination="getPurchaseHisList" />
      <div slot="footer" class="dialog-footer">
        <el-button @click="purchaseHisInfo.show = false">
          <!-- 关闭 -->
          {{ $t('关闭') }}
        </el-button>
      </div>
    </el-dialog>
    <!-- 厂家导入 -->
    <Import
      :title="$t('导入')"
      action="/distribution/manufacturers/importManufacturers"
      templateUrl="distribution/manufacturers/tempDownload"
      @success="getList"
      :show.sync="showImport" />
    <!-- 导入供应商厂家SKU关联 -->
    <Import
      :title="$t('导入供应商厂家SKU关联')"
      action="/distribution/manufacturersSku/importManufacturersSku"
      templateUrl="distribution/manufacturersSku/tempDownload"
      @success="getList"
      :show.sync="showManufacturersSkuImport" />
  </div>
</template>

<script>
import {
  delManufacturersSku,
  getPurchaseListByDistributor,
  manufacturersSkuList,
  listManufacturers,
  getManufacturers,
  delManufacturers,
  addManufacturers,
  updateManufacturers,
  getManufacturersSku,
  addManufacturersSku,
  updateManufacturersSku,
} from '@/api/purchasingManage/manufacturers'
import Import from '@/components/Import/index.vue'
import i18n from '@/language'
export default {
  activated() {
    this.$nextTick(() => this.$refs['mianRef']?.doLayout())
  },
  name: 'Manufacturers',
  components: {
    Import,
  },
  data() {
    return {
      /**
       * 导入组件的显示与隐藏
       */
      showImport: false,
      /**
       * 导入供应商厂家SKU关联
       */
      showManufacturersSkuImport: false,

      // 按钮loading
      buttonLoading: false,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: false,
      // 总条数
      total: 0,
      // 供应厂家表格数据
      manufacturersList: [],
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        skuNo: '',
        pageNum: 1,
        pageSize: 10,
        manufacturersName: undefined,
        manufacturersTel: undefined,
        principalName: undefined,
        principalTel: undefined,
        manufacturersAddress: undefined,
        purchasePlatformLink: undefined,
        deliverPositionCn: undefined,
        deliverWayCn: undefined,
        isDefault: undefined,
        skuPackDemand: undefined,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        manufacturersName: [
          {
            required: true,
            message: i18n.t('请输入'),
            trigger: 'blur',
          },
        ],
        // manufacturersTel: [
        //   { required: true, message: "厂家电话不能为空", trigger: "blur" },
        // ],
        // principalName: [
        //   { required: true, message: "负责人名称不能为空", trigger: "blur" },
        // ],
        // principalTel: [
        //   { required: true, message: "负责人电话不能为空", trigger: "blur" },
        // ],
        // manufacturersAddress: [
        //   { required: true, message: "厂家地址不能为空", trigger: "blur" },
        // ],
        // purchasePlatformLink: [
        //   { required: true, message: "厂家链接不能为空", trigger: "blur" },
        // ],
        // deliverPositionCn: [
        //   { required: true, message: "中国发货仓库不能为空", trigger: "blur" },
        // ],
        // deliverWayCn: [
        //   { required: true, message: "中国发货方式不能为空", trigger: "blur" },
        // ],
        // isDefault: [
        //   {
        //     required: true,
        //     message: "是否默认供应厂家不能为空",
        //     trigger: "blur",
        //   },
        // ],
        // skuPackDemand: [
        //   { required: true, message: "产品捆绑要求不能为空", trigger: "blur" },
        // ],
        // remark: [{ required: true, message: "备注不能为空", trigger: "blur" }],
      },
      /**查看关联sku */
      associatedSkuInfo: {
        tableCheck: [],
        show: false,
        /**厂家id */
        manufacturersId: '',
        title: '',
        tableData: [{}],
        total: 0,
        queryParams: {
          manufacturersId: '',
          pageNum: 1,
          pageSize: 10,
        },
        addInfo: {
          show: false,
          title: '',
          type: '',
          form: {
            skuId: '',
            skuUrl: '',
          },
          // 表单校验
          rules: {
            skuId: [
              {
                required: true,
                message: i18n.t('请选择'),
                trigger: 'blur',
              },
            ],
          },
        },
      },
      /**历史采购价 */
      purchaseHisInfo: {
        show: false,
        total: 0,
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          manufacturersId: '',
        },
        tableData: [],
      },
    }
  },
  created() {
    this.getList()
  },
  methods: {
    /**确认新增管关联ku */
    confirmAddAssociatedSku() {
      this.$refs['addAssociatedSkuRef'].validate((valid) => {
        if (valid) {
          const data =
            this.associatedSkuInfo.addInfo.skuList.filter((i) => {
              return i.skuId == this.associatedSkuInfo.addInfo.form.skuId
            })[0] || {}

          const _data = {
            manufacturersId: this.associatedSkuInfo.queryParams.manufacturersId,
            skuId: data.skuId,
            skuNo: data.skuNo,
            skuUrl: this.associatedSkuInfo.addInfo.form.skuUrl,
          }
          console.log(`_data ==>`, JSON.parse(JSON.stringify(_data)))
          addManufacturersSku(_data).then((res) => {
            const { code, data, msg } = res
            if (code === 200) {
              this.$message({ type: 'success', message: msg })

              this.associatedSkuInfo.addInfo.show = false
              this.getAssociatedSkuList()
            }
          })
        }
      })
    },
    /**确认修改管关联ku */
    confirmEditAssociatedSku() {
      this.$refs['addAssociatedSkuRef'].validate((valid) => {
        if (valid) {
          updateManufacturersSku(this.associatedSkuInfo.addInfo.form).then((res) => {
            const { code, data, msg } = res
            if (code === 200) {
              this.$message({ type: 'success', message: msg })

              this.associatedSkuInfo.addInfo.show = false
              this.getAssociatedSkuList()
            }
          })
        }
      })
    },
    /**新增管关联ku */
    handleAddAssociatedSku() {
      getManufacturersSku().then((res) => {
        const { code, data, msg } = res
        if (code === 200) {
          this.associatedSkuInfo.addInfo.skuList = data
          this.associatedSkuInfo.addInfo.form.skuId = ''
          this.associatedSkuInfo.addInfo.form.skuUrl = ''
          this.associatedSkuInfo.addInfo.show = true
          this.associatedSkuInfo.addInfo.title = i18n.t('添加')
          this.associatedSkuInfo.addInfo.type = 'add'
        }
      })
    },
    /**修改管关联ku */
    handleEditAssociatedSku(row) {
      getManufacturersSku().then((res) => {
        const { code, data, msg } = res
        if (code === 200) {
          this.associatedSkuInfo.addInfo.form = Object.assign(this.associatedSkuInfo.addInfo.form, row)
          this.associatedSkuInfo.addInfo.skuList = data
          this.associatedSkuInfo.addInfo.show = true
          this.associatedSkuInfo.addInfo.title = i18n.t('编辑')
          this.associatedSkuInfo.addInfo.type = 'edit'
          console.log(` ==>`, JSON.parse(JSON.stringify(this.associatedSkuInfo.addInfo.form)))
        }
      })
    },

    async handlePurchaseHis(row) {
      console.log(` ==>`, JSON.parse(JSON.stringify(row)))
      this.purchaseHisInfo.queryParams.skuId = row.skuId
      this.purchaseHisInfo.queryParams.manufacturersId = row.manufacturersId
      await this.getPurchaseHisList()
      this.purchaseHisInfo.show = true
    },
    getPurchaseHisList() {
      getPurchaseListByDistributor(this.purchaseHisInfo.queryParams).then((res) => {
        this.purchaseHisInfo.tableData = res.rows
        this.purchaseHisInfo.total = res.total
      })
    },
    handleDelPurchaseHis(row) {
      console.log(` ==>`, JSON.parse(JSON.stringify(row)))
      this.$confirm(i18n.t('确定删除?'), i18n.t('提示'), {
        type: 'warning',
      }).then(() => {
        delManufacturersSku(row.id).then((res) => {
          const { code, data, msg } = res
          if (code === 200) {
            this.$message({ type: 'success', message: msg })

            this.getAssociatedSkuList()
          }
        })
      })
    },
    async handleAssociatedSku(row) {
      console.log(` ==>`, JSON.parse(JSON.stringify(row)))
      this.associatedSkuInfo.queryParams.manufacturersId = row.id

      this.associatedSkuInfo.title = `${row.manufacturersName}`
      await this.getAssociatedSkuList()
      this.associatedSkuInfo.show = true
    },
    getAssociatedSkuList() {
      manufacturersSkuList(this.associatedSkuInfo.queryParams).then((res) => {
        this.associatedSkuInfo.tableData = res.rows
        this.associatedSkuInfo.total = res.total
      })
    },
    /** 查询供应厂家列表 */
    getList() {
      this.loading = true
      listManufacturers(this.queryParams).then((response) => {
        this.manufacturersList = response.rows
        this.total = response.total
        this.loading = false
      })
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.form = {
        id: undefined,
        manufacturersName: undefined,
        manufacturersTel: undefined,
        principalName: undefined,
        principalTel: undefined,
        manufacturersAddress: undefined,
        purchasePlatformLink: undefined,
        deliverPositionCn: undefined,
        deliverWayCn: undefined,
        isDefault: undefined,
        skuPackDemand: undefined,
        createBy: undefined,
        createTime: undefined,
        updateBy: undefined,
        updateTime: undefined,
        remark: undefined,
      }
      this.resetForm('form')
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm('queryForm')
      this.queryParams.pageSize = 10
      this.queryParams.pageNum = 1
      this.handleQuery()
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset()
      this.open = true
      this.title = i18n.t('添加')
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.loading = true
      this.reset()
      const id = row.id || this.ids
      getManufacturers(id).then((response) => {
        this.loading = false
        this.form = response.data
        this.open = true
        this.title = i18n.t('编辑')
      })
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.buttonLoading = true
          if (this.form.id != null) {
            updateManufacturers(this.form)
              .then((res) => {
                const { code, data, msg } = res
                this.$message({ type: 'success', message: msg })

                this.open = false
                this.getList()
              })
              .finally(() => {
                this.buttonLoading = false
              })
          } else {
            addManufacturers(this.form)
              .then((res) => {
                const { code, data, msg } = res
                this.$message({ type: 'success', message: msg })

                this.open = false
                this.getList()
              })
              .finally(() => {
                this.buttonLoading = false
              })
          }
        }
      })
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids
      this.$modal
        .confirm(i18n.t('确定删除?'))
        .then(() => {
          this.loading = true
          return delManufacturers(ids)
        })
        .then((res) => {
          this.loading = false
          this.getList()
          const { code, data, msg } = res
          this.$message({ type: 'success', message: msg })
        })
        .catch(() => {})
        .finally(() => {
          this.loading = false
        })
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        'distribution/manufacturers/export',
        {
          ...this.queryParams,
        },
        `manufacturers_${new Date().getTime()}.xlsx`,
      )
    },
    /** 导出按钮操作 */
    handleExportManufacturersSku() {
      this.download(
        'distribution/manufacturersSku/exportManufacturersSku',
        {
          ...this.queryParams,
        },
        `exportManufacturersSku_${new Date().getTime()}.xlsx`,
      )
    },
  },
}
</script>
